Below is the source code for example.cfm
<!--- default values --->
<cfparam name="form.Style" default="color:##ff00ff; border-color:##cccccc">
<cfparam name="form.ShowUploadButton" default="true">
<cfparam name="form.RedirectTo" default="">
<cfparam name="form.MaxFile" default="5">
<cfparam name="form.MaxFileSize" default="262144">
<cfparam name="form.MaxFileSizeTotal" default="1048576">
<cfparam name="form.FileFilter" default="Images,*.jpg;*.gif;*.png,Documents,*.doc;*.rtf;*.pdf">
<cfparam name="form.FlashUploadName" default="FlashUpload">
<cfparam name="form.ShowStatus" default="true">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Flash Multi Upload Example</title>
<style type="text/css">
.textfield { font-family: "MS Sans Serif"; font-size: 9pt; border: 1px solid #cccccc; }
.button { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; font-weight: bold; color: #FFFFFF; background-color: #000000; cursor: hand}
.tablestandard { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; }
</style>
</head>
<body>
<cfoutput>
<h3>Flash Multi Upload Example</h3>
<hr size=1>
<strong class="tablestandard">Change Flash file input setting using form below:</strong><br><br>
<table width="100%" cellpadding="2" cellspacing="2" border="0" class="tablestandard">
<cfform action="example.cfm" method="POST" name="frmFlash">
<tr>
<td nowrap valign="top">Maximum number of file allowed to upload:</td>
<td width="100%" valign="top">
<cfinput type="text" name="MaxFile" size="8" value="#form.MaxFile#" class="textfield" required="Yes" message="You have to enter maximum number of file" validate="integer">
(0 means no limit on how many files allowed to upload )
</td>
</tr>
<tr>
<td nowrap valign="top">Maximum file size each allowed to upload:</td>
<td width="100%" valign="top">
<cfinput type="text" name="MaxFileSize" size="20" value="#form.MaxFileSize#" class="textfield" required="Yes" message="You have to enter maximum file size" validate="integer">
(in bytes. 0 means no limit on each file size)
</td>
</tr>
<tr>
<td nowrap valign="top">Maximum file size total allowed to upload:</td>
<td width="100%" valign="top">
<cfinput type="text" name="MaxFileSizeTotal" size="20" value="#form.MaxFileSizeTotal#" class="textfield" required="Yes" message="You have to enter maximum file size total" validate="integer">
(in bytes. 0 means no limit on filesize total)
</td>
</tr>
<tr>
<td nowrap valign="top">Redirect to:</td>
<td width="100%" valign="top">
<cfinput type="text" name="RedirectTo" size="60" value="#form.RedirectTo#" class="textfield"> <br>
(Browser will be redirected to this URL upon upload completion)
</td>
</tr>
<tr>
<td nowrap valign="top">Style:</td>
<td width="100%" valign="top">
<cfinput type="text" name="Style" size="40" value="#form.Style#" class="textfield">
</td>
</tr>
<tr>
<td nowrap valign="top">File filter:</td>
<td width="100%" valign="top">
<cfinput type="text" name="FileFilter" size="80" value="#form.FileFilter#" class="textfield"><br>
Comma delimited list of allowed drop down title and file extensions.<br>
For example: Images,*.jpg;*.gif;*.bmp<br>
Each title and list of extensions are seperated by comma.
</td>
</tr>
<tr>
<td nowrap valign="top">Show upload button in Flash object:</td>
<td width="100%" valign="top">
<select name="ShowUploadButton" class="textfield">
<option value="true" #iif(form.ShowUploadButton is "true",de("selected"),de(""))#>True</option>
<option value="false" #iif(form.ShowUploadButton is "false",de("selected"),de(""))#>False</option>
</select><br>
Note:<br>
If Upload Button is not shown in the flash object,<br>
you still can trigger the upload process by using JavaScript as shown in the ordinary Submit button below.
</td>
</tr>
<tr>
<td nowrap valign="top">Call JavaScript event handler:</td>
<td width="100%" valign="top">
<select name="ShowStatus" class="textfield">
<option value="true" #iif(form.ShowStatus is "true",de("selected"),de(""))#>True</option>
<option value="false" #iif(form.ShowStatus is "false",de("selected"),de(""))#>False</option>
</select><br>
Note:<br>
If true then we will call a JavaScript function for each event generated by FlashMultiUpload.
In this demo, the JavaScript function that will handle the event is called "ShowStatus"
</td>
</tr>
<tr>
<td colspan="2">
<input type="Submit" name="Submit" value="Update Flash Multi Upload Parameters" class="button">
</td>
</tr>
</cfform>
</table>
<hr size="1">
<div class="tablestandard">
<strong>Upload file using Flash Multi Upload component below:</strong><br><br>
<cf_flashmultiupload name="#form.FlashUploadName#" Action="upload.cfm" Style="#form.Style#" FileFilter="#form.FileFilter#"
MaxFile="#form.MaxFile#" MaxFileSize="#form.MaxFileSize#" MaxFileSizeTotal="#form.MaxFileSizeTotal#"
RedirectTo="#form.RedirectTo#" ShowUploadButton="#form.ShowUploadButton#"
OnProgress="#iif(form.ShowStatus is "true",de("ShowStatus"),de(""))#">
<script language="JavaScript">
function ShowStatus(iFlashUploadStatus)
{
if (iFlashUploadStatus==1) alert("Upload completed");
else if (iFlashUploadStatus==-1) alert("Upload canceled");
else if (iFlashUploadStatus==-2) alert("Upload Fail: IO error");
else if (iFlashUploadStatus==-2) alert("Upload Fail: Security error");
else if (iFlashUploadStatus==-4) alert("Upload Fail: HTTP Eeror");
if (iFlashUploadStatus==2) document.body.style.cursor="wait"; // uploading
else document.body.style.cursor="";
}
function Upload()
{
var objFlash;
var iFlashUploadResult;
if(navigator.appName.indexOf("Microsoft") != -1) objFlash = window.#form.FlashUploadName#;
else objFlash = window.document.#form.FlashUploadName#;
iFlashUploadResult=objFlash.FlashUpload_DoUpload();
if (iFlashUploadResult)
{
// uploading
}
else
{
alert("Please select file to upload first");
}
}
</script>
<form>
<input type="Button" value="Submit - Upload" onclick="javascript:Upload();">
</form>
Note: In this example, all uploaded file will be automatically deleted in our server to conserve hard drive space.
<hr size="1">
To upload file along with other form data, <a href="example_2.cfm">please see the following example</a><br>
View source code: <a href="viewsource.cfm?source=example.cfm">example.cfm</a>, <a href="viewsource.cfm?source=upload.cfm">upload.cfm</a>
</div>
</cfoutput>
</body>
</html>